---
layout: default
---

{% assign terms = page.terms | default: 1 %}
<div class="panel-container">
    {% if terms > 0 %}
    <div class="panel-left content">
    {% else %}
    <div class="content panel-singular">
    {% endif %}
        <article class="post" itemscope itemtype="http://schema.org/BlogPosting">

            <header class="post-header">
                <h1 class="post-title" itemprop="name headline">{{ page.title }}</h1>
                <p class="post-meta"><time datetime="{{ page.date | date_to_xmlschema }}" itemprop="datePublished">{{ page.date | date: "%b %-d, %Y" }}</time>{% if page.author %} • <span itemprop="author" itemscope itemtype="http://schema.org/Person"><span itemprop="name">{{ page.author }}</span></span>{% endif %}</p>

            </header>

            <div class="post-content" itemprop="articleBody">
                {{ content }}
            </div>
        </article>
        {% include social-share.html %}
    </div>

    {% if terms > 0 %}
    <div class="splitter">
    </div>

    <div class="panel-right">
        <span class="resize-warning">If the commandline doesn't appear in the terminal, make sure popups are enabled or try resizing the browser window.</span>
        {% for i in (1..terms) %}
        <div class="term{{i}}"></div>
        {% endfor %}
    </div>
    {% endif  %}

</div>

<script>
    (function() {
        var font3 = document.createElement('link');
        font3.type = 'text/css';
        font3.rel = 'stylesheet';
        font3.href = '{{site.baseurl}}/css/syntax-highlighting.css';
        var q = document.getElementsByTagName('link')[0];
        q.parentNode.insertBefore(font3, q);
    })();
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script src="https://rawgit.com/RickStrahl/jquery-resizable/master/dist/jquery-resizable.min.js"></script>
<script src="https://cdn.rawgit.com/play-with-docker/sdk/74a853bbc404ce08c091a4b2c6f1de52df0da933/dist/pwd.js"></script>
<script src="{{site.baseurl}}/js/quiz.js"></script>
<script>
    var siteUrl = "{{ site.url }}"
      {% if site.url == 'https://training.play-with-docker.com' %}
      if ((window.location.protocol + '//' + window.location.hostname) == siteUrl) {
      pwd.on('init', function() {
      pwd.getUserInfo(function(pwduser){
        user = pwduser;
          if(user !== undefined){
              analytics.identify(user.provider_user_id,{"email":user.email});
              } else {
                  analytics.identify();
                  }
      });
    });
      } else {
          console.log('In _config.yml, the site url does not match the url you are serving from, so no analytics were pushed.')
      }
    {% endif %}
    pwd.newSession([{selector: '.term1'}, {selector: '.term2'}, {selector: '.term3'}], {baseUrl: '{{site.pwdurl}}', ImageName: '{{page.image}}'});
    $(".panel-left").resizable({
        handleSelector: ".splitter",
        resizeHeight: false,
        onDragEnd: pwd.resize.bind(pwd)
    });
    window.onbeforeunload = function(e) {
        pwd.closeSession(function(){});
        return;
    }

</script>
